<template>

	<u-picker :show="show" :columns="columns" :keyName="keyName" :defaultIndex="defaultIndex"
		:closeOnClickOverlay="true" @cancel="onClose" @close="onClose"  :immediateChange="true" @confirm="onPicker"></u-picker>

</template>

<script>
	export default {
		props: {
			columns: {
				type: Array,
				default: () => []
			},
			keyName: {
				type: String
			},
			show: {
				type: Boolean
			},
			pickerCurrent: {
				type: [String, Number]
			}
		},
		name: "v-picker",
		data() {
			return {
				defaultIndex: [0]
			}
		},
		watch: {
			show(newV, oldV) {
				if (newV) {
					this.getPickerIndex()
				}
			}
		},
		methods: {
			getPickerIndex() {
				let _this = this
				// this.$nextTick(() => {
				// 	_this.defaultIndex = [0]
				// })
				console.log(this.pickerCurrent, 'this.pickerCurrentthis.pickerCurrentthis.pickerCurrent')
				if (this.pickerCurrent || this.pickerCurrent === 0) {
					const column = this.columns[0]
					column.map((item, index) => {
						if (this.pickerCurrent == item[this.keyName]) {
							this.$nextTick(() => {
								console.log(123)
								_this.defaultIndex = [index]
							})

							return
						}
					})
				} else {
					this.$nextTick(() => {
						_this.defaultIndex = [0]
					})
				}
			},
			onClose() {
				this.$emit('close', false)
			},
			onPicker(e) {
				this.$emit('confirm', e.value[0])
			}
		}
	}
</script>

<style lang="scss">

</style>